<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-1.11.3.min.js"></script>
    <script>
        $(function () {
            //1.给文本框失去焦点事件
            $(':text').blur(function () {
                //2.抓文本框内容
                var username = $(this).val();
                $.ajax({
                    type:'post',
                    url:'controller.php',
                    data:{username:username},
                    dateType:'json',
                    success:function (res) {
                        if(res==1){
                            $('#box').html('<h1 style="color: red">已注册</h1>');
                        }else{
                            $('#box').html('<h1 style="color: blue">可以注册</h1>');
                        }
                    }
                })
            })
        })
    </script>
</head>
<body>
    <form action="controller.php" method="post">
        用户名:<input type="text" name="username" id="username">
        <div id="box"></div>
    </form>
</body>
</html>